<template>
<!--只能有一个div-->
   <div class="homeswiper">
      <!-- 搜索框 -->
      <van-search v-model="value" placeholder="请输入搜索关键词" />
      <!-- 搜索框 -->

     <!-- 轮播图 -->
       <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
            <van-swipe-item v-for="item in bannerData" :key="item.id">
              <img :src="item.picUrl" alt="">
            </van-swipe-item>
            <!-- <van-swipe-item>2</van-swipe-item>
            <van-swipe-item>3</van-swipe-item>
            <van-swipe-item>4</van-swipe-item> -->
       </van-swipe>
    <!-- 轮播图 -->
   </div>
</template>



<script>

import axios from 'axios'

export default {

  data() {
    return {
      search: '',
      bannerData:[]
    };
  },
  created(){
    this.getBanner();

  },
  methods:{
    getBanner(){
    //  axios.get("http://171.220.242.237:3002/recommend/banner")
    //  .then(function(response){
    //    console.log(response.data);
    //  })

    axios.get("/api/recommend/banner","")
    .then(res => {
      console.log(res.data.data)
      this.bannerData=res.data.data;
    })
    .catch(err => {
      console.error(err); 
    })

    } },
    mounted(){
      
    }
    
}
</script>

<style scoped>


  .my-swipe .van-swipe-item img {
    width: 90%;
    border-radius: 10px;
  }

</style>